<template>
	<view class="list">
		
		<block v-for="(item,index) in prolist" :key="index">
			<view class="item" @click="detail(item)">
				<view class="acea-row row-between-wrapper time">
					<view>{{ item.add_time }}</view>
					<view class="">{{ item.is_invoice == 0 ? '开票中':item.is_invoice == 1?'已开票':'待开票' }}</view>
				</view>
				<view class="mt20 fs26 fc333" v-if="item.header_type>0">发票类型：
					<text v-if="item.header_type==2">企业</text>
					<text v-if="item.header_type==1">个人</text>
				</view>
				<view class="mt20 fs26 fc333">发票抬头：{{ item.name }}</view>
				<view class="mt20 fs26 fc333">税务登记证号：{{ item.duty_number }}</view>
				<view class="mt20 fs26 fc333" v-if="item.drawer_phone">开票人手机号：{{ item.drawer_phone }}</view>
				<view class="mt20 fs26 fc333" v-if="item.email">开票人邮箱：{{ item.email }}</view>
				<view class="mt20 fs26 fc333" v-if="item.tell">联系电话：{{ item.tell }}</view>
				<view class="mt20 fs26 fc333" v-if="item.address">注册地址：{{ item.address }}</view>
				<view class="mt20 fs26 fc333" v-if="item.bank">开户行：{{ item.bank }}</view>
				<view class="mt20 fs26 fc333" v-if="item.card_number">银行卡号：{{ item.card_number }}</view>
				<view class="acea-row row-between fs32 mt20 bold">
					<view class="fc333" style="width: 400rpx;">{{ item.title}}</view>
					<view class="money">￥{{item.invoice_price}}</view>
				</view>
				<view class="acea-row row-middle fs28 fc333 mt20">
					<view>{{item.stage_name}}</view>
					<view style="margin-left: 80rpx;">报名{{item.peopleCount}}人</view>
				</view>
			</view>
		</block>
		<view class='loadingicon acea-row row-center-wrapper fs26' v-if="prolist.length>0">
			<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
		</view>
		<pagenone v-if="prolist.length==0"></pagenone>
		
		<view class="apply-btn" @click.stop="pathclick">
			点击申请开票
		</view>
		<view style="width: 100%;height: 200rpx;"></view>
		
	</view>
</template>

<script>
	import{
		openedInvoicableList
	} from '@/api/other.js'
	import pagenone from '../../components/pagenone.vue';
	export default {
		components:{
			pagenone
		},
		data() {
			return {
				loadend: false,
				loading: false,
				loadTitle: this.$t(`加载更多`),
				page:1,
				limit:10,
				prolist:[],
				
			};
		},
		onShow(){
			this.loadend = false;
			this.loading = false;
			this.page = 1;
			this.prolist = [];
			this.getlist();
		},
		methods:{
			getlist(){
				let that = this;
				if (that.loadend) return;
				if (that.loading) return;
				openedInvoicableList({ page:that.page, limit:that.limit }).then(res=>{
					let list = res.data.data;
					let prolist = that.$util.SplitArray(list, that.prolist);
					let loadend = list.length < that.limit;
					that.loadend = loadend;
					that.loading = false;
					that.loadTitle = loadend ? that.$t(`没有更多内容啦~`) : that.$t(`加载更多`);
					that.$set(that, 'prolist', prolist);
					that.$set(that, 'page', that.page + 1);
				}).catch(err=>{
					that.loading = false;
					that.loadTitle = that.$t(`加载更多`);
				})
			},
			detail(item){
				
			},
			pathclick(){
				uni.navigateTo({
					url:`/pages/home/invoic-apply`
				})
			}
		},
		onReachBottom() {
			this.getlist();
		}
	}
</script>

<style lang="scss">
	.list{
		
		.item{
			width: 100%;
			// height: 336rpx;
			border-radius: 20rpx;
			background: #FFFFFF;
			margin-top: 30rpx;
			padding: 30rpx;
			
			.time{
				color: #6252DF;
				font-size: 30rpx;
			}
			.money{
				color: #FF301A;
			}
			
		}
		
		.apply-btn{
			width: 480rpx;
			height: 96rpx;
			border-radius: 48rpx;
			background: rgba(98, 82, 223, 0.2);
			margin: 0 auto;
			position: fixed;
			bottom: 30rpx;
			left: 0;
			right: 0;
			text-align: center;
			line-height: 96rpx;
			font-size: 30rpx;
			color: #6252DF;
		}
		
	}
</style>
	